<template>
  <div id="app">
    <el-button type="primary"  @click.native="testBut">El-But</el-button>
    <mt-button type="primary"  @click.native="testBut">Mt-But</mt-button>
    <h1>{{ msg }}</h1>
<!--引入路由-->
    <router-link to="/home">首页</router-link>
    <router-link to="/news">新闻</router-link>
    <router-view></router-view>

    <br>
    <div>App === 3.引入Life组件 ==></div> <br>
    <v-lief :appTitle="appTitle" :appRun="appRun"  :app="this" ref="life"></v-lief>
    <button @click="getChildData()">获取子组件的数据和方法</button> <br>
  </div>
</template>

<script>
    // 1.引入外部组建
  import Life from "./components/Life";
export default {
  name: 'app',
  data () {
    return {
        appTitle:'来自app的title',
      msg: 'App入口'
    }
  },
  methods:{
      appRun(data){
          alert('我是App的run方法：'+data);
      },
      getChildData(){
          alert(this.$refs.life.msg);
          this.$refs.life.liefRun();
      },
      //方法
      testBut(){
          alert('我是mt-button');
      }
  }
    //2.挂载组建  注意和data同级
  ,components:{
      "v-lief":Life
  }
}
</script>

<style>

</style>
